<template>
  <ga-modal
    v-model:visible="visible"
    :width="520"
    :footer="false"
    @close="handleCancel(formRef)"
  >
    <template #title>查看密码</template>
    <ga-spin style="width: 100%" :loading="loading">
      <ga-form ref="formRef" :model="formData">
        <ga-form-item field="username" label="账号：" label-col-flex="50px">
          {{ formData.username || "---" }}
        </ga-form-item>
        <ga-form-item field="password" label="密码：" label-col-flex="50px">
          {{ formData.password || "---" }}
        </ga-form-item>
      </ga-form>
    </ga-spin>
  </ga-modal>
</template>

<script setup>
import { ref, defineEmits, reactive } from "vue";
import {} from "@/api/vm";
import useLoading from "@/hooks/loading";

const { loading, setLoading } = useLoading(false);
const formRef = ref(null);
const formData = reactive({
  username: "",
  password: "",
});

const visible = ref(false);
const curId = ref("");
const open = async (record) => {
  visible.value = true;
  if (record && record?.id) {
    setLoading(true);
    curId.value = record.id;
    Object.keys(formData).forEach((item) => {
      formData[item] = record[item];
    });
    setLoading(false);
  }
};
const handleCancel = (formEl) => {
  curId.value = "";
  formEl.resetFields();
};
defineExpose({ open });
</script>

<style lang="scss" scoped></style>
